{% extends 'base.html' %}

{% block title %}
<div class='d-flex'>
  <h1 id='pageTitle'>{{ pageTitle }}</h1>
  <a class='ml-auto' href='/api/v2/reports?scope=inventory&format=csv'>
    <button class='btn btn-secondary' data-action='get-inventory-csv'>{{ 'Export'|trans }}</button>
  </a>
</div>
<hr>
{% endblock title %}

{% block body %}
  <div class='pl-3 mb-5'>
    <h4><label for='storageSearchInput'>{{ 'Search containers or locations'|trans }}</label></h4>
    <form class='input-group' method='get'>
      {% set containerSearchPlaceholder = ['Sodium', 'Saccharose', 'Acetone', 'CK-666', 'Fibronectin'] %}
      <input class='form-control' name='q' id='storageSearchInput' placeholder='{{ random(containerSearchPlaceholder) }}' value='{{ App.Request.query.getString('q') }}' />
      <div class='input-group-append'>
        <button class='btn btn-primary' type='submit' data-action='search-storage'>{{ 'Search'|trans }}</button>
      </div>
    </form>

    {% if containersArr|length == 0 and App.Request.query.has('q') %}
      {{ 'No results found'|trans|msg('warning', false) }}
    {% endif %}

    <ul class='list-group mt-2'>
    {# If an entity has multiple compounds, it will appear several times in the sql output, and this is fine because we actually would like to have a row for each compound in each container, even if it's a mix #}
    {# so here we filter on the view by showing only a single Resource/Experiment #}
    {% set uniqueById = containersArr|reduce((acc, r) => acc|merge((acc[(r.page ~ ':' ~ r.entity_id ~ ':' ~ r.storage_id)] is defined) ? {} : {(r.page ~ ':' ~ r.entity_id ~ ':' ~ r.storage_id): r}), {}) %}
    {% for container in uniqueById %}
      <li class='list-group-item'>
        {% if container.entity_custom_id %}<span class='mr-1 color-medium'>{{ container.entity_custom_id }}</span>{% endif %}<a href='{{ container.page }}.php?mode=view&id={{ container.entity_id }}'>{{ container.entity_title }}</a> {{ container.qty_stored }} {{ container.qty_unit }} in {{ container.full_path }}
      </li>
    {% endfor %}
    </ul>
  </div>

  <div class='pl-3 mb-5'>
    {% if App.Config.configArr.inventory_require_edit_rights == 1 %}
      <p>{{ 'Note: only users who were given permission to edit the inventory locations can modify the locations (add/edit/remove).'|trans }}</p>
    {% endif %}
    {% set inventoryDisabled = App.Users.userData.can_manage_inventory_locations == 0 and App.Config.configArr.inventory_require_edit_rights == 1 %}
    <div class='d-flex'>
      <h4>{{ 'Browse inventory locations'|trans }}</h4>
      <div class='ml-auto'>
        <button type='button' {{ inventoryDisabled ? 'disabled' }} class='btn btn-secondary btn-sm' data-parent-id='' data-action='add-storage-children'><i class='fas fa-plus-circle mr-1 color-white'></i>{{ 'Add root element'|trans }}</button>
      </div>
    </div>
    {% include 'storage-list.html' with {'storage_editable': not inventoryDisabled, 'is_entity': false} %}
  </div>
{% endblock body %}
